<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>第八课 DOM操作</title>
    <script src="./jquery.min.js"></script>
</head>

<body>
    <div id="div1">
        <span>星星课堂</span>
        <div class="div2">xingxingclassroom1</div>
        <div class="div2">xingxingclassroom2</div>
        <div class="div3">
            <span class="span3">span3</span>
        </div>
    </div>
    <script>
        var $div1 = $('#div1');
        var $div3 = $('.div3'); 
        var $span3 = $('.span3');
        $span3.on('click',function(){
            alert('span3')
        });
        var $title = $div3.clone(true);
        $title.prependTo($div1);
        // var $title = $div3.clone();
        // $title.prependTo($div1);
        // console.log($title);
        // var $div2 = $('.div2');
        // var $div3 = $('.div3');
        // var $node = $('<h1>星星课堂真棒</h1>');
        // var str = '<h1>星星课堂真强</h1>';
        // str.replaceAll($div3);
        // $node.replaceAll($div3);
        // $div2.replaceWith('<h3>星星课堂真好</h3>');//谁调用replaceWith方法就替换谁
    </script>
</body>

</html>